<template>
  <!--提交订单页面-->
  <div>
    <wv-panel v-if="categoryCode=='vipcard_1' || categoryCode=='vipcard_2'">
      <wv-media-box :thumb="goods.coverImg | imgPathFilter" :title="goods.goodsName"
                    :description="goods.goodsPrice+'元'"></wv-media-box>
    </wv-panel>
    <wv-panel v-else>
      <wv-media-box v-if="isOld" :thumb="goods.coverImg | imgPathFilter" :title="goods.goodsName"
                    :description="goods.vipPrice+'元'"></wv-media-box>
      <wv-media-box v-else :thumb="goods.coverImg | imgPathFilter" :title="goods.goodsName"
                    :description="goods.goodsPrice+'元'"></wv-media-box>
    </wv-panel>
    <div class="divider"></div>
    <wv-group>
      <wv-cell title="数量" value="1" v-if="goods.isLimitNumber==1" v-model="number"/>
      <wv-cell title="数量" v-if="goods.isLimitNumber==2">
        <wv-number-spinner slot="ft" :min="1" v-model="number" input-width="2em" @change="onChange"/>
      </wv-cell>
      <wv-cell title="总计" :value="resultPrice+'元'" class="total"/>
    </wv-group>
    <div class="divider"></div>
    <offer @confirm="offer" :goodsList="goodsList" :resultPrice="resultPrice" :buySource="1"
           :accountElesignId="accountElesignId"></offer>
  </div>
</template>

<script type="text/ecmascript-6">
  import {Dialog} from 'we-vue'
  import {getGoodDetail} from '../../../test/unit/http'
  import {Toast} from 'we-vue'
  import offer from '../offertemplate/offertemplate'

  export default {
    name: 'submitorder',
    props: {},
    data() {
      return {
        src: require('../../assets/guibin.png'),
        number: 1,
        goods: {},
        goodsList: [],
        resultPrice: "",
        isOld: false,
        categoryCode: '',
        accountElesignId: ''
      };
    },
    methods: {
      onChange(val) {
        this.goodsList = [];
        let goodsPrice = this.goods.goodsPrice;
        if (this.isOld) {
          goodsPrice = this.goods.vipPrice;
          if (this.categoryCode == 'vipcard_1' || this.categoryCode == 'vipcard_2') {
            goodsPrice = this.goods.goodsPrice;
            let isContinue = this.goods.isContinue;
            let enterType = this.$route.query.enterType;
            if (isContinue == 1 & enterType == 2) {
              goodsPrice = this.goods.newPrice;
            }
          }
        }
        this.goods['goodsNum'] = val;
        this.goodsList.push(this.goods);
        console.log(this.goodsList);
        let resultPrice = goodsPrice * val;
        this.resultPrice = resultPrice;
      },
      getGoodsDetail(params) {
        getGoodDetail(params).then(res => {
          console.log(res);
          if (res.code == 100) {
            this.goodsList = [];
            this.isOld = res.object.isOld;
            this.categoryCode = res.object.categoryCode;
            this.goods = res.object.goods;
            this.goods['goodsNum'] = this.number;
            this.goods['orderType'] = 1;
            this.goods['unitPrice'] = this.goods.goodsPrice;
            this.resultPrice = this.goods.goodsPrice;
            if (this.categoryCode == 'vipcard_1' || this.categoryCode == 'vipcard_2') {
              this.goods['orderType'] = 1;
            }
            if (this.categoryCode == 'viproom') {
              if (this.goods.isAppoint == 2) {
                this.goods['orderType'] = 2;
              }
            }
            if (this.categoryCode == 'viponly') {
              if (this.goods.isAppoint == 2) {
                this.goods['orderType'] = 3;
              }
            }
            if (this.categoryCode == 'insurance') {
              this.goods['orderType'] = 4;
            }
            if (this.isOld) {
              this.resultPrice = this.goods.vipPrice;
              this.goods['unitPrice'] = this.goods.vipPrice;
              if (this.categoryCode == 'vipcard_1' || this.categoryCode == 'vipcard_2') {
                this.resultPrice = this.goods.goodsPrice;
                this.goods['unitPrice'] = this.goods.goodsPrice;
                let isContinue = this.goods.isContinue;
                let enterType = this.$route.query.enterType;
                if (isContinue == 1 & enterType == 2) {
                  this.resultPrice = this.goods.newPrice;
                  this.goods['unitPrice'] = this.goods.newPrice;
                  this.goods['goodsPrice'] = this.goods.newPrice;
                }
              }
            }
            this.goodsList.push(this.goods);
          } else {
            Toast.fail(res.info);
            this.$router.go(-1);
          }
        })
      },
      offer(payType) {
        if (payType == '线下支付') {
          this.$router.push({
            path: '/downloadoffer'
          })
        } else {
          Dialog.confirm({
            title: '是否取消支付吗？',
            message: '',
            confirmButtonText: '继续支付',
            cancelButtonText: '取消支付'
          }).then(() => {
            // 处理支付逻辑  this.$router.push({ path: '/offersuccess'})

          }).catch(() => {
            // this.$router.go(-1);
          })
        }
      }

    },
    created() {
      let goodsId = this.$route.query.goodsId;
      let accountElesignId = this.$route.query.accountElesignId;
      this.accountElesignId = accountElesignId;
      let enterType = this.$route.query.enterType;
      let params = {goodsId: goodsId, enterType: enterType};
      this.getGoodsDetail(params);
    },
    components: {
      offer
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
  .divider {
    height: 10px;
    background-color: #eee;
  }
</style>
